<!--
**********************************************************
* @Author: 张小平
* @Date:   2024-05-01
* @Email:  qqshuqian@163.com
* @Last modified: 最后修改日期
* @Description: 文件描述
**********************************************************
-->
<template>
    <div class="user">
        <basic-container>
            <avue-crud
                    v-model="form"
                    v-model:page="page"
                    v-model:search="searchForm"
                    :permission="getPermission"
                    v-bind="bindVal"
                    v-on="onEvent"
                    :option="option"
                    :data="tableData"
                    :before-open="beforeOpen"
            >
                <template #menu="scope">
                    <el-button link type="primary"  icon="el-icon-edit" @click="handleDesign(scope.row, scope.index)">设计</el-button>
                    <el-button link type="primary"  icon="el-icon-edit" @click="handlePreview(scope.row, scope.index)">预览</el-button>
                    <el-button link type="primary"  icon="el-icon-check" @click="online(scope.row, scope.index)">发布</el-button>
                    <el-button link type="primary"  icon="el-icon-edit" @click="handleQruey(scope.row, scope.index)">创建查询管理</el-button>
                </template>
            </avue-crud>
        </basic-container>
    </div>
</template>

<script>
    import curdMixin from '@/framework-core/mixins/crud';
    import {publishForm} from "@/framework-admin/api/code/formmodel";
    import {listCore} from "@/framework-core/api/core/api";
    import {saveCore} from "@/framework-core/api/core/api";
    import website  from '@/framework-core/config/website';
    import pinyin from 'js-pinyin'
    export default {
        name: "form_model",
        mixins: [curdMixin],
        data() {
            return {
                pageConfig:{"url":"/form/model"},
                searchForm: {},
                loading: false,
                form:{},
                option: {
                    "border": true,
                    "index": true,
                    "indexLabel": "#",
                    "stripe": true,
                    "menuAlign": "center",
                    "align": "center",
                    "searchMenuSpan": 6,
                    menuWidth: 500,
                    grid: window.isMobile,
                    gridSpan: 24,
                    "column": [

                        {
                            "type": "input",
                            "label": "名称",
                            "prop": "name",
                            "rules": [{
                                required: true,
                                message: '名称不能为空',
                                trigger: 'blur'
                            }],
                            blur: ({ value, column }) => {

                                let ptemp =  pinyin.getCamelChars(value);
                                ptemp = ptemp.trim().replace(/^\d+/, '').replace(/[^a-zA-Z0-9]/g, '');
                                if( !this.form.modelTable){
                                    this.form.modelTable = ptemp;
                                }
                                //console.log('值改变', value, column)
                            },
                            'search': false,
                            "span": 12
                        }
                        ,
                        {
                            "type": "select",
                            "label": "数据库",
                            "prop": "modelDB",
                            dicData: [],
                            'search': true,
                            "span": 12
                        }


                        ,
                        {
                            "type": "input",
                            "label": "表名称",
                            "prop": "modelTable",
                            "rules": [{
                                required: true,
                                message: '表名称不能为空',
                                trigger: 'blur'
                            }],
                            'search': true,
                            "span": 12
                        },
                        {
                            "type": "select",
                            "label": "范围",
                            cell: true,
                            "prop": "frange",
                            dicData: [
                                {"label": "游客", "value": 0},
                                {"label": "私有", "value": 1},
                                {"label": "公共", "value": 2}
                            ],
                            multiple: false,
                            'search': true,
                            value: 1,
                            "span": 12
                        },

                        {
                            "type": "input",
                            "label": "描述信息",
                            "prop": "remark",
                            'search': true,
                            "span": 24
                        },

                        {
                            hide: true,
                            label: '打印模板',
                            prop: 'templatePath',
                            type: 'upload',
                            listType: 'text',
                            dataType: "json",
                            propsHttp: {
                                url: 'url',
                                name: 'name',
                                res: 'data.data'
                            },
                            props: {
                                label: 'originalFilename',
                                value: 'url'
                            },

                            limit: 1,
                            loadText: '打印模板上传中，请稍等',
                            span: 24,
                            canvasOption: {
                                text: "",
                                ratio: 0.1,
                            },
                            accept: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
                            // cropperOption: {
                            //     autoCropWidth: 100,
                            //     autoCropHeight: 100,
                            //     fixed: true,
                            //     fixedNumber: [100, 100],
                            // },
                            tip: '只能上传docx文件，且不超过2kb',
                            action: website.baseUrl + "/api/sys/file/upload"
                        },
                        //     {
                        //   "type": "input",
                        //   "label": "管理部门",
                        //   "prop": "manageOrgId",
                        //     "rules": [{
                        //         required: true,
                        //         message: '管理部门不能为空',
                        //         trigger: 'blur'
                        //     }],
                        //     'search': true,
                        //   "span": 12
                        // }
                        //
                        //
                        //         ,
                        // {
                        //     "type": "select",
                        //     "label": "状态",
                        //     "prop": "status",
                        //     "value": 1,
                        //     "rules": [{
                        //         required: true,
                        //         message: '状态不能为空',
                        //         trigger: 'blur'
                        //     }],
                        //
                        //     dicData: [{
                        //         label: '启用',
                        //         value: "1"
                        //     }, {
                        //         label: '停用',
                        //         value: "0"
                        //     }],
                        //     'search': false,
                        //     hide: true,
                        //     width: 80,
                        //     "span": 12
                        // }

                        // ,
                        // {
                        //     "type": "input",
                        //     "label": "版本",
                        //     width: 60,
                        //     "prop": "version",
                        //     "rules": [{
                        //         required: true,
                        //         message: '版本不能为空',
                        //         trigger: 'blur'
                        //     }],
                        //     'search': false,
                        //     hide: true,
                        //     "value": 0,
                        //     "span": 12
                        // }

                    ]
                },
                imgdatas:[],
            };
        },
        computed: {
            ...mapState({
                permissions: (state) =>state.user.permission,
            })

        },
        created() {
            pinyin.setOptions({ checkPolyphone: false, charCase: 1 });
            this.getDataSourceList();
            this.init();

        },
        methods: {
            init() {
            },
            getDataSourceList() {
                var $that = this;
                listCore("sys/datasource",{}).then(response => {
                  var $Ele1 = $that.findObject(  $that.option.column, 'modelDB');
                    if(!response.data.data){
                      $Ele1.dicData = [];
                      return
                    }
                    let dataSourceList = response.data.data.data;
                    if (dataSourceList.length > 0) {
                        $Ele1.dicData = [];
                        dataSourceList.forEach(function(element) {
                            $Ele1.dicData.push({"label":element.title,"value":element.name})
                        });
                    } else {
                      //  this.$message.error("数据源信息列表为空,请添加数据源");
                    }
                });
            },
            handleDesign: function(row) {
                //this.$router.push({path: "/form/design?id="+ row.id,query: {id:  row.id}});

                let routerJump = this.$router.resolve({path: "/form/design?formId="+ row.id,query: {formId:  row.id}});
                window.open(routerJump.href, '_blank');
            },
            handlePreview: function(row) {
                //this.$router.push({path: "/form/preview?id="+ row.id,query: {id:  row.id}});

                let routerJump = this.$router.resolve({path: "/form/preview?formId="+ row.id,query: {formId:  row.id}});
                window.open(routerJump.href, '_blank');

            },
            handleQruey: function(row) {

                let qform = {};
                qform.title = row.name+"管理";
                qform.app = row.modelTable + "tjcxgl";
                qform.db = row.modelDB;
                qform.tableName = row.modelTable;
                qform.formId = row.id;
                saveCore("/form/queryApp", qform).then(() => {
                    this.$confirm("创建成功，是否去配置查询","提示",{
                        iconClass: "el-icon-question",//自定义图标样式
                        confirmButtonText: "确认",//确认按钮文字更换
                        cancelButtonText: "取消",//取消按钮文字更换
                        showClose: true,//是否显示右上角关闭按钮
                        type: "warning",//提示类型  success/info/warning/error
                    }).then(()=>{
                        //取消操作
                        let routerJump = this.$router.resolve({path: "/form/formqueryapp/index?app="+ qform.app,query: {app:   qform.app}});
                        window.open(routerJump.href, '_blank');
                    }).catch(() => {

                    });
                });
            },

            online: function(row) {
                publishForm( {
                        id:row.id
                    }
                ).then(response => {
                    this.$message.success('发布成功')
                }).catch(error => {
                    this.$message.error(error.msg || error.message)
                })
            },
            getPermission: function (key, row, index) {
                return true;
               // / return this.getCommPermission(key, row, index);
            },

        }
    };
</script>
<style lang="scss">

</style>
